
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>配件详情</title>
	<link rel="stylesheet" type="text/css" href="css/reset.css">
	<link rel="stylesheet" type="text/css" href="css/common.css">
	<link rel="stylesheet" type="text/css" href="css/common_head.css">
	<link rel="stylesheet" type="text/css" href="css/product_detail.css">
	<script src="js/site/require.js" defer async="true" data-main="js/site/product_detail_main"></script>
</head>
<body>
	<!--头部导航开始-->
	<header class="header_outbox">
		<div class="header_inbox">
			<div class="loginbox">
	            <p> 欢迎访问机械配件商城</p>
	            <a href="index.html" target="_blank">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[ 访问官网 ]</a>
	            <span id="register_info">
		            <a href="login.html" class="login">&nbsp;&nbsp;&nbsp;&nbsp;登录&nbsp;&nbsp;</a>
		            <img src="images/common/header_line.jpg">
		            <a href="register.html" class="login">&nbsp;&nbsp;免费注册&nbsp;&nbsp;&nbsp;&nbsp;</a>
	            </span>
	            <span id="login_info" style="display: none;">
	            	<a href="#" id="headerUsername" class="login"></a>
		            <img src="images/common/header_line.jpg">
		            <a href="#" id="headerLogout" class="login">&nbsp;&nbsp;退出</a>
	            </span>
        	</div>
	        <ul class="my_action fix">
	            <li>
	                <a href="#">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;我的关注</a>
	            </li>
	            <li>
	                <img src="images/common//mix_car.png">
	                <a href="cart.html">购物车<span id="cartQuantity">[0]</span></a>
	            </li>
	            <li>
	                <a href="#">我的商城</a>
	            </li>
	        </ul>
		</div>
	</header>
	<!--头部导航结束-->
	<!--Logo和头部搜索开始-->
	
	<div class="action_search_box content_box">
	    <a class="logo" href="index.html"></a>
	    <div class="inputbox">
	        <input type="text" id="keyword" name="keyword"  placeholder="请输入您感兴趣的内容">
	        <button class="searchbtn" id="searchBtn" >搜&nbsp;索</button>
	        <div class="hotword">热销：
	            <a href="product_search.html?name=润滑油" target="_blank">&nbsp;&nbsp;&nbsp;润滑油&nbsp;&nbsp;&nbsp;</a>
	        </div>
	    </div>
	    <img class="telephonenumber" src="images/common/telephone_number.jpg">
	</div>
	<!--Logo和头部搜索结束-->
	<!--分割线-->
	<hr style="height: 1px; border: none; border-top: 1px solid #DDD; margin: 25px 0 0px;">
		<div class="product_detail content_box clearfix">
			<div class="product_detail_main l">
				<!--商品图片 start-->
				<div class="product_picture_list l">
					<div class="product_picture">
						<img class="product_picture_img" id="productMainImage" src="images/details/big_pic.jpg" alt="" style="cursor: crosshair;">
					</div>
					<div class="product_picture_table clearfix">
						<div class="product_picture_table_left l">
							<img src="images/common/left_arrow.jpg">
						</div>
						<div class="product_picture_table_main_container l">
							<div class="product_picture_table_main" >
								<ul id="piclist_container">
									
								</ul>
							</div>
						</div>
						<div class="product_picture_table_right l">
							<img src="images/common/right_arrow.jpg">
						</div>
					</div>
				</div>
				<!--商品图片 end-->


				<!--商品信息 start -->
				<div class="product_info_list l">
					<div class="product_title">
						<div class="product_info_text l">
							<h3 id="product_name_container">
								中联重科液压油200L	
							</h3>
						</div>
						<a href="javascript:void(0);" id="store_btn">
							<div class="product_attention l">
								<span>关注</span>
							</div> </a>
					</div>
					
					<div class="product_price_info">
						<div class="product_price">
							<span class="price_sell_title">现价:</span>
							<span class="price_sell"><span class="per_price" id="productPriceContainer">￥2828.00</span>
							</span> 
						</div>
						<!--
						<div class="productPromotionInfo">
							<span class="PromotionTitle">促销:</span>
							<a href="#">促销9折，5桶起，包邮送回家。</a>
						</div>
						-->
					</div>
					
					<div class="product_delivery">
						<div class="product_delivery_info">
							<span>发货地：</span>
							<span>北京市</span>
							&nbsp;&nbsp;
							<span>配送方式：</span>
                            		<input type="radio" name="send_type"  checked="checked">
                            		<label for="by_self">到付</label>
                            		<input type="radio" name="send_type"  >
                            		<label for="by_self">在线支付</label>
                            &nbsp;&nbsp;
                            <span id="freight"></span>                         
							<br>
							<span>配送至：</span>
							<span>
							 <select id="province" class="area" style="margin-right:4px;"><option value="">请选择...</option><option value="1">北京市</option><option value="18">天津市</option><option value="35">河北省</option><option value="219">山西省</option><option value="351">内蒙古自治区</option><option value="465">辽宁省</option><option value="580">吉林省</option><option value="650">黑龙江省</option><option value="792">上海市</option><option value="810">江苏省</option><option value="926">浙江省</option><option value="1028">安徽省</option><option value="1150">福建省</option><option value="1245">江西省</option><option selected="selected" value="1357">山东省</option><option value="1515">河南省</option><option value="1692">湖北省</option><option value="1809">湖南省</option><option value="1946">广东省</option><option value="2089">广西壮族自治区</option><option value="2213">海南省</option><option value="2240">重庆市</option><option value="2279">四川省</option><option value="2482">贵州省</option><option value="2580">云南省</option><option value="2726">西藏自治区</option><option value="2807">陕西省</option><option value="2925">甘肃省</option><option value="3026">青海省</option><option value="3078">宁夏回族自治区</option><option value="3106">新疆维吾尔自治区</option><option value="3219">台湾省</option><option value="3292">香港特别行政区</option><option value="3314">澳门特别行政区</option></select>
							 <select id="city" class="area" style="margin-right: 4px;"><option value="">请选择...</option><option value="1358">济南市</option><option value="1369">青岛市</option><option value="1382">淄博市</option><option value="1391">枣庄市</option><option value="1398">东营市</option><option selected="selected" value="1404">烟台市</option><option value="1417">潍坊市</option><option value="1430">济宁市</option><option value="1443">泰安市</option><option value="1450">威海市</option><option value="1455">日照市</option><option value="1460">莱芜市</option><option value="1463">临沂市</option><option value="1476">德州市</option><option value="1488">聊城市</option><option value="1497">滨州市</option><option value="1505">菏泽市</option></select>
							 <select id="district" class="area" style="margin-right: 4px;"><option value="">请选择...</option><option value="1405">芝罘区</option><option value="1406">福山区</option><option value="1407">牟平区</option><option value="1408">莱山区</option><option value="1409">长岛县</option><option value="1410">龙口市</option><option value="1411">莱阳市</option><option value="1412">莱州市</option><option value="1413">蓬莱市</option><option value="1414">招远市</option><option value="1415">栖霞市</option><option value="1416">海阳市</option></select>
					         <input type="hidden" id="areaId" name="areaId" value="1405">
				            </span>
						</div>
					</div>

					<div class="product_select">
						<div class="product_select_num clearfix">
							<span class="product_select_num_title l">数量：</span>
							<div class="product_select_num_value l">
								<a href="javascript:void(0);" class="product_minus_2 l"></a>
								<input name="" id="product_num" type="text" value="1" maxlength="8" class="l" autocomplete="off">
								<a href="javascript:void(0);" class="product_plus_1 l "></a>
							</div>
							<span id="stock_container" class="l">库存：</span>

						</div>
						<div class="product_select_buy_type">
							<span class="product_select_buy_type_title l">购买方式：</span>
							<input type="hidden" id="buyType" name="buyType" value="1-1">
							<div class="product_select_buy_type_items l">
								<a href="javascript:void(0);" class="product_select_buy_type_item l product_select_buy_type_item_selected" dat="2828" type="1-1" data-price="￥2828.00">全额支付<i></i>
								</a> 
							</div>
						</div>
					</div>

					<div class="product_buy">
						<a href="javascript:void(0);" id="buy">
							<div class="buy_btn l buy_now">
								立刻购买
							</div> </a>
						<a href="javascript:void(0);" id="addCart">
							<div class="buy_btn l add_cat">
								加入购物车
							</div> </a>								
					</div>

					<div class="pledges">
						<div class="pledges_title l" style="margin-top:3px;">
							服务承诺：
						</div>
						<div class="pledges_items l">
							<div class="l pledges_item">
								<img src="images/common/pledges_01.jpg">
							</div>
							<div class="l pledges_item">
								<img src="images/common/pledges_02.jpg">
							</div>
							<div class="l pledges_item">
								<img src="images/common/pledges_03.jpg">
							</div>
						</div>
					</div>
				</div>
                <!-- 商品信息 end -->


				<!-- 推荐套装 start -->
				
				<div class="recommended_package l">
					<div class="recommended_package_title">
						<h3>
							推荐套装
						</h3>
					</div>
					
					<div class="recommended_package_items">
						<div class="recommended_package_item l">
							<div class="recommended_package_item_pic">
								<img src="images/details/tj_left.jpg">
							</div>
							<div class="recommended_package_item_name">
								<span>中联重科液压油2...</span>
							</div>
						</div>
						<div class="recommended_package_plus l"></div>
						<div class="recommended_package_item l">
							<div class="recommended_package_item_pic">
								<a href="#"><img src="images/details/tj_left_02.jpg"></a>
							</div>
							<div class="recommended_package_item_name">
								<span>发动机专用机油
								</span>
							</div>
							<div class="recommended_package_item_chk">
								<input type="checkbox" value="423" name="packageProduct" checked="checked">
								<label for="recommended_1">
									<span class="item_price" dat="328">￥328.00</span>
								</label>
							</div>
						</div>
						<div class="recommended_package_price r">
							<div class="recommended_package_price_info">
								<span class="recommended_package_price_text">共计：</span>
								<span class="recommended_package_price_num"><span class="total-price" dat="3156">￥3156.00</span>
								</span>
							</div>
							<a href="javascript:void(0);">
								<div class="recommended_package_buy">
									<div class="recommended_package_buy_btn">
										立刻购买
									</div>
								</div> </a>
						</div>
						<div class="recommended_package_equal_sign r"></div>
					</div>
					
				</div>

				<!-- 推荐套装 end -->



			</div>

			<!--侧边相关配件-->
			<div class="product_related_box l">
				<div class="product_related_title">
					相关配件
				</div>
				<div class="product_related_list_container">
					<div class="product_related_list">
						<div class="product_related">
							<div class="product_related_pic">
								<a href="#" title="中联重科液压油18L">
									<img src="images/details/rel_left_01.jpg"></a>
							</div>
							<div class="product_related_text">
								<div class="product_related_name">
									<a href="#" title="中联重科液压油18L">中联重科液压油18</a>
								</div>
								<div class="product_related_price">
									<span>￥279.00</span>
								</div>
							</div>
						</div>
						<div class="product_related">
							<div class="product_related_pic">
								<a href="#" title="锂基脂 ZL-2">
									<img src="images/details/rel_left_02.jpg"></a>
							</div>
							<div class="product_related_text">
								<div class="product_related_name">
									<a href="#" title="锂基脂 ZL-2">锂基脂 ZL-2</a>
								</div>
								<div class="product_related_price">
									<span>￥256.00</span>
								</div>
							</div>
						</div>
						<div class="product_related">
							<div class="product_related_pic">
								<a href="#" title="发动机专用机油">
								<img src="images/details/rel_left_03.jpg"></a>
							</div>
							<div class="product_related_text">
								<div class="product_related_name">
									<a href="#" title="发动机专用机油">发动机专用机油</a>
								</div>
								<div class="product_related_price">
									<span>￥328.00</span>
								</div>
							</div>
						</div>
						<div class="product_related">
							<div class="product_related_pic">
								<a href="#" title="国四底盘 专用尿素">
									<img src="images/details/rel_left_04.jpg">
								</a>
							</div>
							<div class="product_related_text">
								<div class="product_related_name">
									<a href="#" title="国四底盘 专用尿素" >国四底盘 专用尿素</a>
								</div>
								<div class="product_related_price">
									<span>￥42.00</span>
								</div>
							</div>
						</div>
						<div class="product_related">
							<div class="product_related_pic">
								<a href="#" title="锂基脂 00#" >
								<img src="images/details/rel_left_05.jpg"></a>
							</div>
							<div class="product_related_text">
								<div class="product_related_name">
									<a href="#" title="锂基脂 00#">锂基脂 00#</a>
								</div>
								<div class="product_related_price">
									<span>￥215.00</span>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="product_related_more">
					<img src="images/common/arrow_up.jpg" class="scroll_up">
            		<img src="images/common/arrow_down.jpg" class="scroll_down">
				</div>
			</div>
			<div class="product_tab_bar_box l">
				<ul class="product_tab_bar">
					<li class="product_tab_selected" data-index="0">
						产品详情
					</li>
					<li data-index="1">
						规格参数
					</li>
				</ul>
				<ul class="product_tab_contents">
					<li class="product_tab_content_show" id="detailContainer">
						<div class="product_tab_content product_details_tab">
							<div class="product_details_tab_top">
								<span class="product_details_tab_title">中联重科液压油200L</span>
								<img class="product_details_tab_top_line" src="images/common/productDetailsTabTop_line.png">
							</div>
							<div class="product_details_tab_content">
								<div class="introduction">
								<p align="left">
									<span style="font-family:Microsoft YaHei;font-size:16px;"><strong><span style="font-size:18px;">特别申明：</span></strong><span style="font-size:18px;">由于</span></span><span style="font-family:Microsoft YaHei;font-size:18px;">库存原因，该产品蓝、绿色</span><span style="font-family:Microsoft YaHei;font-size:18px;">外桶</span><span style="font-family:Microsoft YaHei;font-size:16px;"><span style="font-size:18px;">包装将</span><span style="font-size:18px;">根据实际情况随机发货，</span></span><span style="font-family:Microsoft YaHei;font-size:16px;"><span style="font-size:18px;">三个工作日左右</span><span style="font-family:Microsoft YaHei;font-size:18px;">发货</span></span><span style="font-family:Microsoft YaHei;font-size:16px;"><span style="font-size:18px;">，敬请谅解</span><span style="font-size:18px;">！</span></span> 
								</p>
								<p align="left">
									<span style="font-family:Microsoft YaHei;font-size:16px;"></span><strong style="line-height:24px;font-family:'font-size:16px;white-space:normal;"><span style="font-size:18px;"></span></strong>&nbsp;
								</p>
								<p align="left">
									<strong style="line-height:24px;font-family:'font-size:16px;white-space:normal;"><span style="font-size:18px;">产品适配主机：</span></strong><span style="font-family:Microsoft YaHei;color:#000000;font-size:18px;">混凝土</span><span style="font-family:'font-size:18px;white-space:normal;color:#000000;">机械全系列设备</span> 
								</p>
								<p align="center">
									&nbsp;
								</p>
								<p align="center">
									<img alt="" src="http://zoomlionmall.com/upload/image/201703/bc3a31d3-500f-4842-b674-838c79ce9fda.jpg"> 
								</p>
																		</div>
							</div>
						</div>
					</li>
					<li>
						<div class="product_tab_content" id="specParamContainer">
							ddd
						</div>
					</li>
				
				</ul>
			</div>
		</div>
	</div>
	<!--商品详情结束-->


	<!--产品服务开始-->
	<div id="product_service" class="content_box clearfix">
        <ul>
            <li class="item l">
                <p class="item_icon icon1 l"></p>
                <div class="item_text l">
                    <p class="text_tit">真实货源</p>
                    <p class="text_info">一手货源&nbsp;真实存在</p>
                </div>
            </li>
            <li class="item l">
                <p class="item_icon icon2 l"></p>
                <div class="item_text l">
                    <p class="text_tit">品质保障</p>
                    <p class="text_info">垂直专业&nbsp;优选厂商</p>
                </div>
            </li>
            <li class="item l">
                <p class="item_icon icon3 l"></p>
                <div class="item_text l">
                    <p class="text_tit">服务保障</p>
                    <p class="text_info">专业服务团队</p>
                </div>
            </li>
            <li class="item l">
                <p class="item_icon icon4 l"></p>
                <div class="item_text l">
                    <p class="text_tit">交易透明</p>
                    <p class="text_info">买卖双方面谈价格</p>
                </div>
            </li>
        </ul>
	</div>
	<!--产品服务结束-->
	<!--底部开始-->
	<div class="footerbox">
        <div class="footer">
	        <div class="content_box clearfix">
	            <div class="footerinside">
	                <h1>新手指南</h1>
	                <a href="#" target="_blank">免费注册</a>
	                <a href="#" target="_blank">个人资料及密码</a>
	                <a href="#" target="_blank">商品关注</a>
	                <a href="#" target="_blank">查询订单</a>
	                <a href="#" target="_blank">购物流程</a>
	            </div>
	            <div class="footerinside">
	                <h1>付款/退款</h1>
	                <a href="#" target="_blank">在线支付</a>
	                <a href="#" target="_blank">银行转账</a>
	                <a href="#" target="_blank">发票办理</a>
	            </div>
	            <div class="footerinside">
	                <h1>配送方式</h1>
	                <a href="#" target="_blank">快递配送</a>
	                <a href="#" target="_blank">零担物流</a>
	            </div>
	            <div class="footerinside">
	                <h1>售后服务</h1>
	                <a href="#" target="_blank">退货流程</a>
	                <a href="#" target="_blank">退货政策</a>
	            </div>
	            <div id="currentfooterInside" class="footerinside">
	                <h1>帮助中心</h1>
	                <a href="#" target="_blank">常见热点问题</a>
	                <a href="#" target="_blank">联系我们</a>
	                <a href="#" target="_blank">投诉与建议</a>
	            </div>
	        </div>
        </div>

        <div class="copyright_bgcolor">
	        <div class="copyright">Copyright © 2018 XXXX数字科技有限公司 版权所有 保留一切权利 鲁ICP备XXXXXXXX号-X</div>
        </div>
    </div>
	<!--底部结束-->
</body>
</html>


<!--小图列表-->
<script id="product_pic_list_tpl" type="text/x-handlebars-template">
	{{#each subImages}}
	    <li>
			<img src="{{this}}" >
		</li>
    {{/each}}
</script>
